<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-touch-fullscreen" content="yes" />
    <title>台风路径</title>
    <link href="css/typhoon.css" rel="stylesheet" type="text/css" />
        <!-- <script type="text/javascript"
      src="http://maps.googleapis.com/maps/api/js?sensor=true&libraries=weather&language=zh_CN">
    </script> -->
    <script type="text/javascript" src="http://ditu.google.cn/maps/api/js?sensor=true&libraries=weather&language=zh_CN"></script>
    <script type="text/javascript" src="javascript/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="javascript/namespace.js"></script>
    <script type="text/javascript" src="javascript/maplabel.js"></script>
    <script type="text/javascript" src="javascript/iscroll.js"></script>
    <script type="text/javascript" src="javascript/mymap.js"></script>
    <script type="text/javascript" src="javascript/typhoon.js"></script>
    <style>
        #listTitle {
            position: absolute;
            color: #FFFFCC;
            display: none;
            top:0px;left:6px;
            font-size:16px;
            padding:2px;
            padding-left:6px;
            padding-right:6px;
        }
        #listDiv {
            position: absolute;
            display: none;
            top:114px;left:6px;
            font-size:16px;
            width: 320px;
            height: 240px;
            background: rgba(255,255,255,0.6);
            overflow: auto;
        }
        /* 去除版权信息
        .gmnoprint { display:none !important; }*/
    </style>
  </head>
  
  <body>
    <div id="map_canvas"></div>
    <div class="header-bg">
        <!-- 标题 -->
        <div class="header">
            <!--<img src="images/pin1.png" class="header-logo" />
        --></div>
        <div id="menu" class="menu">
            <!--<button class="menu-bg-out" style="margin-left: 20px;" onclick="l1menu(this,'fx')" onmousedown="this.className='menu-bg-out'" onmouseup="this.className='menu-bg-on'">防&nbsp;&nbsp;汛</button>
            <button class="menu-bg-out" style="margin-left: 2px;" onclick="l1menu(this,'qx')" onmousedown="this.className='menu-bg-out'" onmouseup="this.className='menu-bg-on'">气&nbsp;&nbsp;象</button>
            <button class="menu-bg-out" style="margin-left: 2px;" onclick="l1menu(this,'szy')" onmousedown="this.className='menu-bg-out'" onmouseup="this.className='menu-bg-on'">水资源</button>
            <button class="menu-bg-out" style="margin-left: 2px;" onclick="l1menu(this,'slgc')" onmousedown="this.className='menu-bg-out'" onmouseup="this.className='menu-bg-on'">水利工程</button>
            <button class="menu-bg-out" style="margin-left: 2px;" onclick="l1menu(this,'oa')" onmousedown="this.className='menu-bg-out'" onmouseup="this.className='menu-bg-on'">OA办公</button>-->
        </div>
    </div>
    <div id="l2-menu" class="l2-menu-bg"></div>
    <div class="maptype">
        <button onclick="setMapType('map')"id="">交通</button>
        <button onclick="setMapType('terrain')">地形</button>
        <button onclick="setMapType('satellite')">${str}</button>
        <button onclick="setMapType('satellite')">卫星</button>
    </div>
    <div class="legend">
        <img id="legendImg" src="images/legend_typhoon.png" />
    </div>
    <div id="listTitle" class="l3-menu-bg">
        <select name="mode" id="yearList" onchange="net.htwater.Typhoon.yearSelect()"></select>
        <p style="margin-top:6px;margin-bottom:6px;">
        <a href="javascript:net.htwater.Typhoon.showCloud()" id="showCloud">显示云层</a>
        <p style="margin-top:6px;margin-bottom:6px;">
        <a href="javascript:net.htwater.Typhoon.clearTyphoon()" id="showCloud">清除台风</a>
        <p style="margin-top:6px;margin-bottom:6px;">
        <a href="javascript:net.htwater.Typhoon.showList()" id="showTyphoon">隐藏列表</a>
    </div>
    <div id="listDiv" class="l3-menu-bg">
        <div class="scroller">
            <ul id="listItem">
            </ul>
        </div>
    </div>
    <div id="popinfo" class="popinfo">
                        弹出气泡：台风名称、时间、风速、方向
    </div>
  </body>
</html>
